<template>
	<view class="box">
		<uni-card>
			<view class="qy_name">
				<text class="names">企业/单位名称</text>
				<input class="name_input" type="text" v-model="companyname" placeholder="请输入名称" maxlength="10">
			</view>
			<view class="qy_name">
				<text class="names">法人姓名</text>
				<input class="name_input" type="text" v-model="username" placeholder="请输入名字" maxlength="5">
			</view>
			<view class="qy_name">
				<text class="names">法人身份证</text>
				<input class="name_input" type="number" v-model="idcard" placeholder="请输入身份证号" @blur="blur">
			</view>
			<view class="qy_name">
				<text class="names">注册号</text>
				<input class="name_input" type="number" v-model="recid" placeholder="输入注册号" maxlength="6">
			</view>
			<view class="qy_name">
				<text class="names">联系电话</text>
				<input class="name_input" type="number" placeholder="请输入电话号码" v-model="phones" @blur="blurphone">
			</view>

			<view class="qy_name">
				<view class="names" style="margin-right: 20rpx;">
					公司图片
				</view>
				<uni-file-picker limit="1" v-model="imageValue" fileMediatype="image" mode="grid" @select="select"
					@progress="progress" @success="success" @fail="fail" />
			</view>
			<view class="btn">
				<button @click="btn" style="margin-top: 20rpx;">立即认证</button>
			</view>
		</uni-card>
	</view>
</template>

<script>
	const db = uniCloud.database()
	import {
		isCardNo
	} from "@/utils/idcard.js"
	import {
		isMobileNumber
	} from '@/utils/phone.js'
	export default {
		data() {
			return {
				imageValue: [],
				imageurl: '',
				src: 'https://mp-ccffe9fb-6491-49ff-938f-e2f9c933dbd6.cdn.bspapp.com/user_info/1697472051645.jpeg',
				idcard: '',
				videtion: false,
				phones: '',
				recid: '',
				companyname: '',
				username: ''
			};
		},
		methods: {
			select() {},
			progress() {},
			success(e) {
				console.log(e)
				uni.showLoading({
					mask:true
				})
				let filename = e.tempFiles[0].extname
				uniCloud.uploadFile({
					filePath: e.tempFiles[0].path,
					cloudPath: '/company/' + Date.now() + '.' + filename,
					cloudPathAsRealPath: true,
					success: e => {
						console.log(e, '陈工')
						this.imageurl = e.fileID
						uni.hideLoading()
					},
				});
			},
			//失去焦点
			blur() {
				let tempidcard = Number(this.idcard)
				if (!isCardNo(tempidcard)) {
					console.log('不通过', isCardNo(tempidcard))
					uni.showToast({
						title: "身份证号码不合法",
						icon: "none"
					})
					this.videtion = false
				} else {
					this.videtion = true
				}
			},
			blurphone() {
				let phone = Number(this.phones)
				if (!isMobileNumber(phone)) {
					console.log('不合格', isMobileNumber(phone))
					uni.showToast({
						title: "手机号码不合法",
						icon: "none"
					})
					this.videtion = false
				} else {
					console.log('合格')
					this.videtion = true
				}
			},
		async	btn() {
				if (this.imageurl.trim() == "") {
					uni.showToast({
						title: "请上传图片",
						icon: 'none'
					})
					return;
				}
				if (this.companyname.trim() == "" || this.username.trim() == "" || this.recid.trim() == "" || this
					.videtion == false) {
					uni.showToast({
						title: '请填写完整/正确信息',
						icon: 'none'

					})
					return;
				}
				
				let tempobj = {
					company_id:this.recid,
					user_name: this.username,
					idcard: Number(this.idcard),
					phonenumber: Number(this.phones),
					company_name: this.companyname,
					company_image:this.imageurl
				}
				uni.showLoading({
					
				})
			await db.collection("argee").add({
					...tempobj
					
				}).then(res=>{
					uni.hideLoading()
					uni.showToast({
						title:"认证成功",
						icon:'none'
					})
					
					console.log('成功',res)
					uni.navigateBack()
					
				})
				console.log('666',tempobj)
			}
		}
	}
</script>

<style lang="scss">
	.box {
		.qy_name {
			margin-top: 30rpx;
			display: flex;
			align-items: center;

			.names {
				font-weight: 800;
				font-size: 30rpx;

			}

			.name_input {
				margin-left: 20rpx;
				background-color: #eee;
				font-weight: 800;
				font-size: 30rpx;
				font-family: "楷体";
				border-radius: 10rpx;
			}
		}
	}
</style>
<style>
	page {
		background-color: #48C9B0;
	}
</style>